<template>
    <div>
        <div>{{ teacher.name }}</div>
        <div>{{ teacher.age }}</div>
        <div>{{ teacher.salary }}</div>
        <button @click="timeFly">过了一年</button>
    </div>
</template>
  
<script>
export default {
    data () {
        return {
            teacher: {
                name: "harry",
                age: 28,
                salary: 3000,
            },
        };
    },
    methods: {
        timeFly () {
            this.teacher.age += 1;
            this.teacher.salary += 500;
        },
    },
    watch: {
        teacher: {
            immediate: true,
            deep: true,
            handler (newValue) {
                if (newValue.age === 40) {
                    alert(`您都${newValue.age}了，工资有${this.teacher.salary}该退休了`);
                }
            },
        },
    },
};
</script>

<style>

</style>
